<!--
 * @Author: vectorwings
 * @Email: vectorwings@163.com
 * @GitHub: https://github.com/vector-wings/
 * @Company: Copyright 2019 HuaZhuTech, Inc.
 * @Date: 2019-10-24 22:07:59
 * @LastEditors: vectorwings
 * @LastEditTime: 2019-10-25 11:52:14
 * @Description: 任务台账-详情页面-概要信息
 -->
<template>
  <section class="card" @click="$emit('do')">
    <div class="card_projectName">{{obj.orgName || '---'}}</div>
    <div class="card-label-level-2">检查部位：<span class="card-label-con">{{obj.checkParts || '---'}}</span></div>
    <div class="card-label-level-2">检查类型：<span class="card-label-con">{{obj.checkTypeName || '---'}}</span></div>
    <div class="card-label-level-2">任务描述：<span class="card-label-con">{{obj.description || '---'}}</span></div>
    <div class="card-label-level-2">本次任务周期：<span class="card-label-con">{{(obj.startTime || '').substr(0,10)}}~{{(obj.endTime || '').substr(0,10)}}</span></div>
    <section>
      <div class="card-label-level-2">检查频率：<span class="card-label-con">{{obj.checkFrequency || '0'}}天/次</span></div>
    </section>
    <section>
      <div class="card-label-level-2">检查率：<span class="card-label-con">{{obj.checkRate || '0'}}%</span></div>
    </section>
    <div class="card-label-level-2">上次检查时间：<span class="card-label-con">{{obj.lastCheckTime || '---'}}</span></div>
    <section>
      <div class="card-label-level-2">检查人：<span class="card-label-con">{{obj.checkUserName || '---'}}</span></div>
    </section>
    <section>
      <div class="card-label-level-2">责任人：<span class="card-label-con">{{obj.responsibleUserName || '---'}}</span></div>
    </section>
    <div class="card-label-level-2">
      附件：
      <span @click="loadFile(obj.fileAddress)">{{handImg(obj.fileAddress)}}</span>
      <!--<div class="photo">-->
        <!--<img :src="obj.photoUrl" alt=""/>-->
      <!--</div>-->

    </div>
    <div class="card-label-level-2">
      平面图：
      <MapShow :width="'100%'" :url="obj.photoUrl"
               :points="handPoint(obj.lonLat)"
               enableClick
               :single="true"
               readonly></MapShow>
    </div>
  </section>
</template>

<script>
export default {
  name: 'TaskSummaryCard',
  props: {
    obj:Object,
  },
   data() {
    return {
     allpoint:[]
    };
  },
  created() {
    // this.allpoint = this.handPoint(this.obj.lonLat)
    // console.log(this.allpoint)
  },
  methods: {
    handPoint(str){
      if(!str){
        return []
      }
      let arr = [];
      let data = JSON.parse(str)
      for(let i = 0;i<data.length;i++){
        let p = data[i].split(',')
        arr.push({
          left: p[0],
          top: p[1],
          lng: p[0],
          lat: p[1],
        })
      }
      console.log(arr)
      return arr;
    },

    loadFile(list){
      console.log(list);
      let a = document.createElement('a');
      a.setAttribute("href",list);
      a.setAttribute("download", list);
      a.click();
    },
    splitFirstLetter (letters) {
      if (letters !== null && letters !== undefined) {
        return letters.substr(0, 1)
      }
      return '无'
    },
    handImg(str){
      if(!str){
        return ''
      }
      return str.split(',').map(o=>o.substr(o.lastIndexOf('/')+1,o.length)).join(',')
    }
  }
}
</script>

<style lang="scss" scoped="scoped">
  .card {
    height:100%;
    padding: 0.07rem;
    border-bottom: 0.01rem solid #EFEFEF;
    background-color: #FFFFFF;
    box-shadow:0px 2px 8px 0px rgba(182,182,182,0.4);
    display: flex;
    flex: 1;
    flex-direction: column;
    overflow-y: auto;
    margin:0.12rem;
    padding: 0.12rem;
    .card_projectName{
      font-size:0.19rem;
      font-family:PingFangSC-Medium,PingFang SC;
      font-weight:500;
    };
    .card-label-level-2{
      font-size:0.15rem;
      font-family:PingFangSC-Regular,PingFang SC;
      font-weight:400;
      color:rgba(140,140,140,1);
      line-height:0.3rem;
      .photo{
        width:3.47rem;
        height:2.08rem;
      }
      .card-label-con{
        font-size:0.15rem;
        font-family:PingFangSC-Medium,PingFang SC;
        font-weight:500;
        color:rgba(61,61,61,1);
        line-height:0.21rem;
      }
    }
    .card-label-level-2-margin{
      display: flex;
      justify-content: space-between;font-size:0.15rem;
      font-family:PingFangSC-Regular,PingFang SC;
      font-weight:400;
      color:rgba(140,140,140,1);
      line-height:0.21rem;
    }
  }
</style>
